import React, { Component } from 'react'
import RouterView from '../router'
import { Layout, Menu,Button} from 'antd';
import { UserOutlined, LaptopOutlined, NotificationOutlined } from '@ant-design/icons';
const { Header, Sider } = Layout;
const { SubMenu } = Menu;

export default class Admin extends Component {
  

    render() {

      let selectedkey=sessionStorage.getItem("selectedKey")?sessionStorage.getItem('selectedKey'):"/admin/teacher/list";
      let openKey=sessionStorage.getItem("openKey")?sessionStorage.getItem('openKey'):"/admin/teacher";
        return (
            <div>


<Layout>
    <Header className="header">
      <span className="logo"></span>  <span> 八维教学管理系统 </span>   <span>  你好 {sessionStorage.getItem('username')}</span>
                    <span><Button type="primary" onClick={() => {
                        sessionStorage.removeItem('token');
                        sessionStorage.removeItem('username');
                        this.props.history.push('/login');
                    }}>  退出</Button></span>
     
    </Header>
    <Layout>
      <Sider width={200} className="site-layout-background">
        <Menu
          mode="inline"
          defaultSelectedKeys={[selectedkey]}
          defaultOpenKeys={[openKey]}
          style={{ height: '100%', borderRight: 0 }}
        >
          <SubMenu key="/admin/teacher" icon={<UserOutlined />} title="教师管理">
            <Menu.Item key="/admin/teacher/list" onClick={()=>{
                sessionStorage.setItem('selectedKey','/admin/teacher/list');
                sessionStorage.setItem('openKey','/admin/teacher');
                this.props.history.push('/admin/teacher/list');
            }}>教师列表</Menu.Item>
            <Menu.Item key="/admin/teacher/cate" onClick={()=>{
                sessionStorage.setItem('selectedKey','/admin/teacher/cate');
                sessionStorage.setItem('openKey','/admin/teacher');
                this.props.history.push('/admin/teacher/cate');
            }}>教师分类</Menu.Item>
          </SubMenu>
          <SubMenu key="/admin/student" icon={<LaptopOutlined />} title="学生管理">
            <Menu.Item key="/admin/student/list" onClick={()=>{
               sessionStorage.setItem('selectedKey','/admin/student/list');
               sessionStorage.setItem('openKey','/admin/student');
                this.props.history.push('/admin/student/list');
            }}>学生列表</Menu.Item>
          </SubMenu>
          <SubMenu key="/admin/product" icon={<NotificationOutlined />} title="产品管理">
            <Menu.Item key="/admin/product/list" onClick={()=>{
               sessionStorage.setItem('selectedKey','/admin/product/list');
               sessionStorage.setItem('openKey','/admin/product');
                this.props.history.push('/admin/product/list');
            }}>产品列表</Menu.Item>
          </SubMenu>
        </Menu>
      </Sider>
      <Layout style={{ padding: '0 24px 24px',minHeight:'700px' }}>

         {/* { 路由出口，显示子路由匹配的组件页面} */}
         <RouterView routes={this.props.routes}></RouterView>
        
      </Layout>
    </Layout>
  </Layout>
 
            </div>
        )
    }
}
